import './App.css';
import { Route,Redirect ,Switch } from 'react-router-dom';
//rcc 生成类组件
//rsf 生成函数式组件

import React, { Component, lazy, Suspense } from 'react';
var Login = lazy(()=>import('./views/Login'))  //登录页
var Index = lazy(()=>import('./views/Index'))  //首页页
var Register = lazy(()=>import('./views/Register'))  //注册页
var ImgT = lazy(()=>import('./views/ImgT'))  //图文页
var Ship = lazy(()=>import('./views/Ship'))  //图文页
var Phone = lazy(()=>import('./views/Phone'))  //图文页
var Pm = lazy(()=>import('./views/Pm'))  //开药页
var Hhao = lazy(()=>import('./views/Hhao'))  //挂号页
var Fans = lazy(()=>import('./views/Fans'))  //粉丝页
var Pcmm = lazy(()=>import('./views/Pcmm'))  //好评页
var Setup = lazy(()=>import('./views/Setup'))  //设置页

// 导入组件
class App extends Component {
  render() {
    return (
      <div className='app'>
         <Suspense fallback={<div  className='loading'><img src="https://hbimg.b0.upaiyun.com/942a62fe6eae0bdb9dd1f28940d7cf8c05e8c7ea29ed-Gg5396_fw658" alt="" /></div>}>
          <Switch>
            <Route path="/index" component={Index} />
            {/* <Route  path="/xiangqing/:id" component={CDetails} /> */}
            <Route exact path="/login" component={Login} />
            <Route exact path="/register" component={Register} />
            <Route exact path="/imgt" component={ImgT} />
            <Route exact path="/ship" component={Ship} />
            <Route exact path="/phone" component={Phone} />
            <Route exact path="/pm" component={Pm} />
            <Route exact path="/hhao" component={Hhao} />
            <Route exact path="/fans" component={Fans} />
            <Route exact path="/pcmm" component={Pcmm} />
            <Route exact path="/setup" component={Setup} />
            <Redirect exact from='/' to="/index" />
            {/* <Route path="*" component={NotFound} /> */}
          </Switch>
        </Suspense>
      </div>
    );
  }    
}

export default App;